<template>
	<!--POP画册、POP下单、道具下单-->
	<view class="page-content">
		<view class="page-top">
			<!-- 标题栏和状态栏占位符 -->
			<view class="titleNview-placing"></view>
			<!-- 标题+筛选 -->
			<w-tit leftIcon="arrowleft" color="#595757" background="#fff" fontweight="600" :title="page_title"
				:rightIcon="user_statu.add_statu?'plusempty':''" @confirm="rightSearch" @rightAdd="rightAdd"
				rightIconNum="two">
			</w-tit>
		</view>
		<scroll-view class="page-body" :scroll-top="scrollTop" scroll-y="true" @scrolltolower="loadmore()">
			<!--动态-->
			<template v-if="datalist && datalist.length > 0 ">
				<view class="body-box">
					<block v-for="(item,index) in datalist" :key="index">
						<view class="body-box-li" @click.stop="toDet(item)">
							<note-book-li :obj="item" @del="deleted(item.id)"></note-book-li>
						</view>
					</block>
				</view>

				<!-- 上拉加载 -->
				<view class="det-con-more">
					<load-more :loadmore="load_more1"></load-more>
				</view>
			</template>
			<!--无数据-->
			<empty v-else no-full type="noData"></empty>
		</scroll-view>
	</view>
</template>

<script>
	import wTit from '@/components/w-tit/w-tit-back-serch-add.vue'; //标题
	import loadMore from '@/components/uni-load-more/load-more.vue';
	import noteBookLi from '@/pages/components/note_book_li.vue';
	import {
		mapGetters,
		mapActions
	} from 'vuex';
	import { getNotepadLists, delNotepads } from '@/common/api.js'
	
	export default {
		components: {
			loadMore,
			noteBookLi,
			wTit
		},
		data() {
			return {
				scrollTop: 0,
				noData: false,
				load_more1: '', //下拉加载文字
				load_sta: false, //是否是加载状态
				datalist: [],
				page_title: '记事本',
				user_statu: {
					add_statu: false,
					replace_statu: false,
					stick_del_statu: false
				},
				serchCont: ''
			}
		},
		onLoad(option) {
			console.log(222, option)
			this.getData()
		},
		onShow() {
			this.getData()
		},
		computed: {
			...mapGetters(['companyInfo','selIndex'])
		},
		methods: {
			//跳转详细页
			toDet(item) {
				let list = JSON.stringify(item);
				uni.navigateTo({
					url: `/pages/noteBook/noteBookDet?item=${list}`
				})
			},
			rightAdd() {
				uni.navigateTo({
					url: `/pages/noteBook/noteBookAdd`
				})
			},
			rightSearch(e) {
				this.serchCont = e.value
				this.getData()
			},
			//删除
			deleted(e) {
				console.log(333, e)
				if (this.datalist && this.datalist.length > 0) {
					let params = {
						id: e,
					};
					delNotepads(params).then(res=> {
						if(res.code === 2000){
							uni.showToast({
								icon: 'none',
								title:'删除成功'
							})
							this.getData()
						} else {
							uni.showToast({
								icon: 'none',
								title: res.msg
							})
						}
					})
				}
			},
			loadmore() {

			},
			getData() {
				let params = {
					company_id: this.companyInfo.id,
					search: this.serchCont,
				};
				getNotepadLists(params).then(res=> {
					if(res.code === 2000){
						this.datalist = res.data.data
					} else {
						uni.showToast({
							icon: 'none',
							title: res.msg
						})
					}
				})
			}
		}
	}
</script>

<style lang="scss">
	.titleNview-placing {
		height: var(--status-bar-height);
		box-sizing: content-box;
		background: $uni-bg-color;
		display: block;
		position: sticky;
		top: 0rpx;
		z-index: 9999;
		overflow: hidden
	}

	.page-content {
		width: 100vw;
		height: 100%;
		background: $uni-bg-color-grey;

		.page-top {
			display: flex;
			flex-direction: column;
			box-sizing: content-box;
			background: $uni-bg-color;
			display: block;
			position: sticky;
			top: 0rpx;
			z-index: 9999;
			border-bottom: 1rpx solid #F2F4F5;
		}

		.page-body {
			display: flex;
			height: calc(100% - 90rpx - var(--status-bar-height));
			padding-top: 0rpx;

			.body-box {
				display: flex;
				flex-direction: column;
				padding: 30rpx 30rpx 0 30rpx;

				.body-box-li {
					padding: 30rpx;
					margin-bottom: 30rpx;
					background: $uni-bg-color;
					border-radius: 10rpx;
				}
			}
		}
	}
</style>
